Thumbnail Navigator 



Allows the visitor to easily browse with Previous and Next through several thumbnail images (all of which are preloaded so they show up instantly). Then they can click the Go button to be taken to the selected thumbnail's full size image. 
--------------------------------------------------------------------------------
 

<!-- TWO STEPS TO INSTALL THUMBNAIL NAVIGATOR:

  1.  Copy the coding into the HEAD of your HTML document
  2.  Add the last code into the BODY of your HTML document  -->

<!-- STEP ONE: Paste this code into the HEAD of your HTML document  -->

<HEAD>

<SCRIPT LANGUAGE="JavaScript">
<!-- Original:  Daniel Smith (xalres@earthlink.net) -->
<!-- Web Site:  http://home.earthlink.net/~xalres -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
prev1 = new Image (32,18);
prev1.src = "prev1.jpg";
prev2 = new Image (32,18);
prev2.src = "prev2.jpg";

next1 = new Image (32,18);
next1.src = "next1.jpg";
next2 = new Image (32,18);
next2.src = "next2.jpg";

go1 = new Image (48,24);
go1.src = "go1.jpg";
go2 = new Image (48,24);
go2.src = "go2.jpg";

maxPic = 5;

p1 = new Image (144,96);
p1.src = "1-thumb.jpg";
link1 = "1-full.jpg";

p2 = new Image (144,96);
p2.src = "2-thumb.jpg";
link2 = "2-full.jpg";

p3 = new Image (144,96);
p3.src = "3-thumb.jpg";
link3 = "3-full.jpg";

p4 = new Image (144,96);
p4.src = "4-thumb.jpg";
link4 = "4-full.jpg";

p5 = new Image (144,96);
p5.src = "5-thumb.jpg";
link5 = "5-full.jpg";

count = 1;
function next() {
count++;
if (count > maxPic) {
count = 1;
}
eval("document.p.src=p" + count + ".src");
}
function back() {
count--;
if (count == 0) {
count = maxPic;
}
eval("document.p.src=p" + count + ".src");
}
function link() {
location.href=eval("link" + count);
}
//  End -->
</script>
</HEAD>

<!-- STEP TWO: Copy this code into the BODY of your HTML document  -->

<BODY>

<center>
<table bgcolor="#003366" border=0>
<tr>
<td align=center width=300>
<font color=white face="Arial, Helvetica" size="+1">Thumbnail Navigator</font>
<br><br>
<img name=p src="1-thumb.jpg" border=0 width=144 height=96>
<br>
<table border=0>
<tr>
<td><a href="javascript:back()" onmouseover="prev.src=prev2.src" onmouseout="prev.src=prev1.src"><img src="prev1.jpg"  width="32" height="18" border="0" name="prev"></td>
<td><a href="javascript:link()" onmouseover="go.src=go2.src" onmouseout="go.src=go1.src"><img src="go1.jpg" width="48" height="24" border="0" name="go"></td>
<td><a href="javascript:next()" onmouseover="next.src=next2.src" onmouseout="next.src=next1.src"><img src="next1.jpg" width="32" height="18" border="0" name="next"></td>
</tr>
</table>
<br>
<font color="#A3ACC9" size="2" face="Arial">
Browse to a picture you like and click "GO".</font>
</td>
</tr>
</table>
</center>

<p><center>
<font face="arial, helvetica" size="-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>

<!-- Script Size:  2.57 KB -->